본문으로 건너뛰기

05.14 일지

🎯 Git Flow 공부​

branch들​

main: 배포용 브랜치
develop: 다음 출시버전을 개발하는 브랜치
feature: 특정 기능(이슈) 개발 브랜치
release: 이번 출시버전을 준비하는 브랜치
hotfix: 출시버전에서 발생한 버그를 수정하는 브랜치

  • main ← develop
  • develop에는 상시로 버그를 수정해서 커밋 추가
  • develop ← feature : 새로운 기능을 추가 & 이후 develop에 merge
  • develop ← release : QA 과정 & 이후 main/develop으로 merge

Git/Github를 이용한 세팅 Tip​

  • PR시 -- close #issue : Merge하면 해당 번호의 issue가 자동으로 닫힌다
  • branch 컨벤션 맞추기 -- feat/#issue
  • commit 컨벤션 맞추기 -- chore: logger 라이브러리 추가
  • merge시 -- github에서만 수행(리뷰를 받고 나서)
  • merge후 -- git pull origin branch : 바뀐 remote 브랜치 정보를 로컬에 불러오는 과정
  • Action을 사용, CD에 도움 😞 ⇒ 사용법은 알아봐야할 것!!

🎯 Flutter SplashScreen​

: 새로운 prayhelper 프로젝트에 참여해 모바일 웹뷰를 띄우는 역할을 맡았다

MyApp()에서 정의​

List<Future> 정의, List 안의 모든 Future가 완료되면 FutureBuilder가 snapshot을 반환하는 구조

//FutureBuilder로 일정시간 후 실현되는 Future을 기다림(SplashScreen이 떠있는 시간)
//List<String?>으로 다룰 이유가 전혀없음.. 수정필요
return FutureBuilder<List<String>?>(

    //Future.wait로 List안의 모든 Future가 끝나길 기다린다
    future: Future.wait(
        [
          SplashDelay.waiting(),
          // + Future of 웹페이지를 불러오는 시간
        ],
    ),
    
    builder: (context, AsyncSnapshot<List<String>?> snapshot) {
      if (snapshot.hasData) {
        return MaterialApp(
          home:WebViewScreen(controller: controller),
        );       
      } else {
            return const SplashScreen();
        }
    }
    
);

snapshot이 없을 때 → SplashScreen을 띄운다 snapshot이 있을 때 → WebViewScreen을 띄운다

SplashScreen()에서 정의​

화면 자체는 이미지가 들어감

return Center(
    child: Image.asset("assets/images/splash-screen.png"),
);

Image Asset에 명시하기​

  • assets/images/abc.png에 이미지 다운로드
  • pubspec.yaml에서 assets 부분에 명시

🎯 WebView 구현​

: webview_flutter 플러그인 이용

😞 ⇒ 플러그인 이해보단 우선 구현을 목표로 했음. 차후 이해 필요​

참고문서​

플러그인 4+에서 웹뷰 사용법
https://velog.io/@gkdlvj1214/Flutter-Webview-4.0-%EA%B8%B0%EB%B3%B8-%EC%97%B0%EA%B2%B0-%EA%B0%80%EC%9D%B4%EB%93%9C

WebView 사용시 main()에서 세팅해줘야 할 것
https://stackoverflow.com/questions/57689492/flutter-unhandled-exception-servicesbinding-defaultbinarymessenger-was-accesse

왜 사용되는지 모르겠는 get 플러그인
https://pub.dev/packages/get/install

MyApp()에서​

final controller = WebviewMainController.to.getController();

WebViewScreenState()에서​

Widget build(BuildContext context) {
    return WillPopScope(
        child: WebViewWidget(controller: widget.controller),
        onWillPop: (){
          return onGoBack();
        }
    );
  }
  
Future<bool> onGoBack() async {
    if (await widget.controller.canGoBack()) {
      widget.controller.goBack();
      return Future.value(false);
    } else {
      Future<bool> dialogResult = showExitPopup();
      return Future.value(dialogResult);
    }
  }

main()에서​

WidgetsFlutterBinding.ensureInitialized();
Get.put(WebviewMainController());

WebviewMainController() 정의​

class WebviewMainController extends GetxController {
  static WebviewMainController get to => Get.find();

  var controller = WebViewController()
    ..setJavaScriptMode(JavaScriptMode.unrestricted)
    ..setBackgroundColor(const Color(0x00000000))
    ..setNavigationDelegate(
      NavigationDelegate(
        onProgress: (int progress) {
          // Update loading bar.
        },
        onPageStarted: (String url) {},
        onPageFinished: (String url) {},
        onWebResourceError: (WebResourceError error) {},
        onNavigationRequest: (NavigationRequest request) {
          if (request.url.startsWith('https://www.youtube.com/')) {
            return NavigationDecision.prevent;
          }
          return NavigationDecision.navigate;
        },
      ),
    )
    ..loadRequest(Uri.parse('https://flutter.dev'));

  WebViewController getController() {
    return controller;
  }
}

😞 할 일​

  • Flutter - WebView 코드 이해해 시간을 쏳는걸로
  • 못했던 학교공부(운영체제)